<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<%@ include file="include/peizhi.jsp"%>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
	<head>
		<base href="${ctx}">
		<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
		<meta name="viewport" content="width=device-width, initial-scale=1,maximum-scale=1, user-scalable=no">
        
        <title>后台管理中心</title> 
		<link rel="stylesheet" href="${ctx}/css/pintuer.css" /> 
		<link rel="stylesheet" href="${ctx}/css/admin.css" /> 
        <script type="text/javascript" src="${ctx}/js/jquery-1.9.1.min.js"></script>
        <script type="text/javascript" src="${ctx}/js/pagehoutai.js"></script>
    </head>
  	<body style="background-color:#f2f9fd;"> 
	  <jsp:include page="include/header.jsp" flush="true"/>
  <div class="admin"> 
  	<div class="panel admin-panel">
	  <div class="panel-head"><strong class="icon-reorder"> 内容列表</strong></div>
	  <div class="padding border-bottom">  
	  <button type="button" class="button border-yellow" onclick="addadv()"><span class="icon-plus-square-o"></span> 添加图片</button>
	  </div>
	  <table id='pagehtml' class="table table-hover text-center">
	    
	    <tr>
	      <th width="10%">ID</th>
	      <th width="20%">图片</th>
	      <th width="15%">名称</th>
	      <th width="20%">描述</th>
	      <th width="10%">排序</th>
	      <th width="15%">操作</th>
	    </tr>
	   
	    <tr>
	      <td>1</td>     
	      <td><img src="<%=path%>/images/11.jpg" alt="" width="120" height="50" /></td>     
	      <td>首页焦点图</td>
	      <td>描述文字....</td>
	      <td>1</td>
	      <td><div class="button-group">
	      <a class="button border-main" href="#add"><span class="icon-edit"></span> 修改</a>
	      <a class="button border-red" href="javascript:void(0)" onclick="return del(1,1)"><span class="icon-trash-o"></span> 删除</a>
	      </div></td>
	    </tr>
	    <tr>
	      <td>2</td>     
	      <td><img src="<%=path%>/images/11.jpg" alt="" width="120" height="50" /></td>     
	      <td>首页焦点图</td>
	      <td>描述文字....</td>
	      <td>1</td>
	      <td><div class="button-group">
	      <a class="button border-main" href="#add"><span class="icon-edit"></span> 修改</a>
	      <a class="button border-red" href="javascript:void(0)" onclick="return del(1,1)"><span class="icon-trash-o"></span> 删除</a>
	      </div></td>
	    </tr>
	    <tr>
	      <td>3</td>     
	      <td><img src="<%=path%>/images/11.jpg" alt="" width="120" height="50" /></td>     
	      <td>首页焦点图</td>
	      <td>描述文字....</td>
	      <td>1</td>
	      <td><div class="button-group">
	      <a class="button border-main" href="#add"><span class="icon-edit"></span> 修改</a>
	      <a class="button border-red" href="javascript:void(0)" onclick="return del(1,1)"><span class="icon-trash-o"></span> 删除</a>
	      </div></td>
	    </tr>
	    
	  </table>
	</div>
	<script type="text/javascript">
	function del(id,mid){
		alert("您确定要删除吗?");
	}
	</script>
	<div class="panel admin-panel margin-top" id="add" hidden='hidden'>
	  <div class="panel-head"><strong><span class="icon-pencil-square-o"></span> 增加内容</strong></div>
	  <div class="body-content" id='addBanner'>
	  <table border="6" align="center" valign="center">
	  <form method="post" class='formAdd' class="form-x" action="${ctx}/adv/banner"> 
	  	<tr style="display:block;margin:20px 0">
	  		<td><label>标题：</label> <input type="text" value="" name="title" placeholder="请输入标题" /><br/>
	  	</tr>
	  	<tr style="display:block;margin:20px 0">
	  		<td><label>图片：</label> <input type="file" value="" class='imageflle'  placeholder="请选择文件" />
	  		<input onclick="imageAdd()" type="button" class='shangchuan' value="上传"/><input type="hidden" id='headimg' name='imageurl'  value=""><br/>
	  	</tr>
	  	<tr style="display:block;margin:20px 0">
	  		 <td><label>描述：</label><textarea type="text" name="content" style="height:20px;" value=""></textarea><br/>
	  	</tr>
	  	<tr style="display:block;margin:20px 0">
	  		 <td><label>排序：</label><input type="text" name="numb" value="0"  data-validate="required:,number:排序必须为数字" /><br/>
	  	</tr>
	  	<tr style="display:block;margin:20px 0">
	  		 <td><label>url地址：</label><input type="text" name="url" placeholder="上传指定url地址"/></textarea><br/>
	  	</tr>
	  	</form>
	  </table>
	  </div>
	</div>
   <form id="pageForm" action="${ctx}/adv/getListAdv">
		<input type="hidden" name="pageNo" id="pageNo" value="0" /> 
		<input type="hidden" name="pageSize" id="pageSize" value="10" /> 
		<input id='lastPage' type="hidden">
	</form>
  </div> 
 </body>
 <script type="text/javascript">
 //添加banner
 function addadv(){
 	var html = $("#addBanner").html();
 	alert(html,'submintForm()','提交');
 }
 //上传图片
function imageAdd(){
 		//上传图片
		var fd = new FormData();
			fd.append("upload", 1);
			fd.append("image",$(".imageflle").get(1).files[0]);//id为上传图片的id字符串image应该是后台接收的对象
		$.ajax({
				url: "${ctx}/Upload/image2",
				type: "POST",
				processData: false,
				contentType: false,//禁止ajax识别类型
				data: fd,
				success: function(data) {
					//console.log(d);
					//background:url(icon.jpg) no-repeat left center; width:200px; height:30px;
					if(data!='' && data!=null){
						$(".shangchuan").attr("onclick","");
						$(".shangchuan").val("上传成功","");
						//$("#imagezhanshi").attr("style","background:url(${ctx}/upload/img/logo.jpg)no-repeat no-repeat center; width:200px; height:30px;");
					}else{
						alert("上传不成功请重新上传");
					}
				}
			});
 	}
 	function submintForm(){
 	var parm = {'title':$("input[name='title']").get(1).value,
 				'imageurl':$("input[name='imageurl']").get(0).value,
 				'content':$("textarea[name='content']").get(1).value,
 				'numb':$("input[name='numb']").get(1).value,
 				'url':$("input[name='url']").get(1).value};
 		$.ajax({
 			url:"${ctx}/adv/banner",
 			type:"post",
 			data:parm,
 			success:function(data){
 				doOk();
 				if(data=='1'){
 					alert("添加成功");
 				}else{
 					alert("添加失败");
 				}
 				
 			}
 		});
 	}
 	page(1,3);
 	var listhead='<tr>'+
	      '<th width="15%">标题</th>'+
	      '<th width="20%">图片</th>'+
	      '<th width="20%">描述</th>'+
	     ' <th width="25%">操作</th>'+
	    	'</tr>';
	var listhtml = "<tr>";
		  listhtml = listhtml + "<td>{0}</td>";
	      listhtml = listhtml + "<td><img src='${ctx}/images/{1}' alt='' width='120' height='50' /></td>";     
	      listhtml = listhtml + "<td>{2}</td>";
	      listhtml = listhtml + "<td><div class='button-group'>";
	      listhtml = listhtml + "<a class='button border-main' href='#add'><span class='icon-edit'></span> 修改</a>";
	      listhtml = listhtml + "<a class='button border-red' href='javascript:void(0)' onclick='del({3})'><span class='icon-trash-o'></span> 删除</a>";
	      listhtml = listhtml + "</div></td>";
		  listhtml = listhtml + "</tr>";
	function pageAppend(data){
		return listhtml.replace('{0}',data.title)
		.replace('{1}',data.imageurl)
		.replace('{2}',data.content)
		.replace('{3}',data.id);
	}
	//删除
	function del(id){
		alert("是否删除","deleteAdv("+id+")");
	};
	function deleteAdv(id){
		doOk();
		alert(id);
	}
</script>
</html>